<template>
	<view class="add">
		<block v-if="!boxHide">
			<!-- <view class="add_item">
				<view>商户头像</view>
				<image mode="aspectFill" :src="upJson.avatar" class="add_header" @tap="addHeader()"></image>
			</view> -->
			<view class="add_item">
				<view>商户名称</view>
				<input type="text" :value="upJson.title" placeholder="请输入商户名称" :data-name="'title'" @input="getInputValue"/>
			</view>
			<view class="add_item">
				<view>区域</view>
				<input type="text" :value="upJson.country" @click.stop="openSearch('regoin')" placeholder="请选择区域" disabled/>
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<!-- <view class="add_item">
				<view>公司</view>
				<input type="text" :value="upJson.company" placeholder="请输入区域" :data-name="'company'" @input="getInputValue"/>
			</view> -->
			<view class="add_item">
				<view>联系人</view>
				<input type="text" :value="upJson.name" placeholder="请输入联系人" :data-name="'name'" @input="getInputValue"/>
			</view>
			<view class="add_item">
				<view>电话</view>
				<input type="number" :value="upJson.mobile" placeholder="请输入电话" :data-name="'mobile'" @input="getInputValue"/>
			</view>
			<view class="add_item">
				<view>地址</view>
				<view class="add_addr" @tap="getAddr()">
					<image src="/static/images/addr.png"></image>
					<view>{{address == "" ? "点击选择客户地址" : address}}</view>
					<image src="/static/images/right.png" class="right"></image>
				</view>
			</view>
			<view class="add_item">
				<view>详细地址</view>
				<input type="text" :value="upJson.detailed_address" placeholder="请输入客户详细地址，例1层101室" :data-name="'detailed_address'" @input="getInputValue"/>
			</view>
			<view class="add_item" @click.stop="openSearch('label')">
				<view>标签</view>
				<input type="text" v-model="upJson.labels" placeholder="选择标签" disabled/>
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<view class="add_item">
				<view>类型</view>
				<picker mode="selector" :range="typeList" class="add_picker" :data-name="'type'" @change="getInputValue">
					<text>{{upJson.type}}</text>
					<image src="/static/images/right.png" class="right"></image>
				</picker>
			</view>
			<view class="add_item" @click.stop="openSearch('trackStatus')">
				<view>跟踪状态</view>
				<input type="text" v-model="upJson.tracking_state" placeholder="选择跟踪状态" disabled/>
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<view class="add_item" @click.stop="openSearch('all_user2')">
				<view>售后负责人</view>
				<input type="text" v-model="afterSale.name" placeholder="选择售后负责人" disabled/>
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<view class="add_item" @click.stop="openSearch('all_user3')">
				<view>业务联系人</view>
				<input type="text" v-model="businessContact.name" placeholder="选择业务联系人" disabled/>
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<view class="add_item" @click.stop="openSearch('biz_area')">
				<view>营业面积</view>
				<input type="text" v-model="upJson.biz_area" placeholder="选择营业面积" disabled/>
				<image src="/static/images/right.png" class="right"></image>
			</view>
			<view class="add_textarea" v-if="!inputhide">
				<view>备注</view>
				<textarea :value="upJson.desc" placeholder="请输入备注" :data-name="'desc'" @input="getInputValue"/>
			</view>
			<view class="save" @tap="save()">保存</view>
		</block>
		<Loading ref="load"></Loading>
	</view>
</template>

<script>
	import {
		deepClone
	} from '@/static/js/index.js'
	export default{
		data(){
			return{
				load:{},
				typeList:[],
				labelList:[],
				afterSale:{//售后负责人
					name:'',
					id:''
				},
				businessContact:{//业务联系人
					name:'',
					id:''
				},
				"address":"",    // 地址
				type:0,
				inputhide:true,
				upJson:{
					"company":"", //公司/单位
					"title":"",//商户名称
					"country":"", //区域
					"name":"", //客户名称
					"mobile":"",//联系方式
					"province":"",//省
					"city":"",//市
					"area":"",//区
					"address":"",//地址
					"detailed_address":"",// 详细地址
					"longitude":"",//纬度
					"latitude":"",//纬
					"tracking_state":"",//跟单状态
					"type":"",//类型
					"labels":"",//标签
					"tracking_state":"",//跟踪状态
					"sale_user_id":"",//业务售后人
					"contact_user_id":"",//业务联系人
					"desc":"",//备注
					"class":"",//客户/商户
					"class": 1,   //puno
					"user_id":"",
					"biz_area":"" // 营业面积
				},
				
				kid:"",
				boxHide:true
			}
		},
		onLoad(options) {
			//this.isGetLocation();
			this.upJson.user_id = uni.getStorageSync("userId")
			this.businessContact={
				name:this.$store.getters.userInfo.username,
				id:this.$store.getters.userInfo.id
			}
			this.$api.getClientTypeList({}).then(res =>{
				this.typeList = res;
				this.upJson.type = this.typeList[0];
			})
			if(options.kid != "undefined"){
				uni.setNavigationBarTitle({title:"修改"})
				this.$refs.load.initLoading({loadType:1,loadPrompt:false}).then(res =>{
					this.$api.getClientDetails({id:options.kid,user_id:uni.getStorageSync("userId")},0).then(res => {
						if(res){
								this.upJson.mobile = res.mobile;
								this.upJson.title =  res.title;
								this.upJson.country = res.country;
								this.upJson.name = res.name;
								this.upJson.type = res.type;
								this.upJson.labels = res.labels.join("|");
								this.upJson.tracking_state = res.tracking_state;
								this.upJson.contact_user_id = res.contact_user_id;
								this.upJson.sale_user_id = res.sale_user_id;
								this.upJson.desc = res.desc;
								this.upJson.avatar = res.avatar;
								this.upJson.id = res.id;
								this.upJson.province = res.province;
								this.upJson.city = res.city;
								this.upJson.address = res.address;
								this.upJson.detailed_address = res.detailed_address;
								this.address = res.province + res.city + res.area + res.address
								this.upJson.biz_area = res.biz_area;
						}
						this.boxHide = false;
						this.$refs.load.getLoadingData({}).then(res => {
							this.inputhide = false;
						});
					})
				});
				this.type = 1
			}else{
				this.boxHide = false;
				this.inputhide = false;
			}
		},
		onShow() {
			this.setBaseNews();
		},
		methods:{
			getAuthorizeInfo() { // 验证是否有权限，如果没有在提示
				let that = this;
				uni.authorize({ // 地址授权请求
					scope:"scope.userLocation",
					success(){
						console.log("授权成功！！！！");
					},
					fail(){
						uni.openSetting({ // 调用小程序设置界面
							success(res){
								console.log("返回结果----》》》》》》》》",res);
							},
							fail(){
								console.log('换气失败-----》》》》》');
							}
						})
					}
				})

			},
			isGetLocation(a="scope.userLocation"){ // 检查是否已经授权了方法scope属性

				let that = this;
				uni.getSetting({
					success(res){
						console.log("授权情况-----《《《《《",res);
						if (!res.authSetting[a]) {  //3.1 每次进入程序判断当前是否获得授权，如果没有就去获得授权，如果获得授权，就直接获取当前地理位置
							that.getAuthorizeInfo()
						}else{
							//that.getLocationInfo()
							console.log("获取地址---》》》》");
						}       

					}
				})

			},
			//设置基础信息
			setBaseNews(){
				let obj=deepClone(this.$store.getters['parameters/searchObj']);
				console.log('obj====',obj)	
				if(obj.key=="label"){
					let data=obj.data.map(item=>{
						return item.value
					});
					this.upJson.labels=data.join('|');
				}else if(obj.key=="trackStatus"){
					this.upJson.tracking_state=obj.data.value;
				}else if(obj.key=="regoin"){
					this.upJson.country=obj.data.value;
				}else if(obj.key=="all_user2"){
					this.afterSale={
						name:obj.data.username,
						id:obj.data.id
					}
				}else if(obj.key=="all_user3"){
					this.businessContact={
						name:obj.data.username,
						id:obj.data.id
					}
				}else if(obj.key=="biz_area"){
					this.upJson.biz_area = obj.data.value;
				}
				this.$store.dispatch('parameters/deleteObj');
			},
			//添加标签
			openSearch(key){
				uni.navigateTo({
					url:'/pages/searchList/searchList?searchKey='+key
				})
			},
			addHeader(){
				let that = this;
				uni.chooseImage({
					count:1,
					success(res) {
						that.$api.uploadFile(res.tempFilePaths).then(res => {
							that.upJson.avatar = res[0];
						})
					}
				})
			},
			getAddr(){//获取地址
				let that = this;
				uni.chooseLocation({
					success(e) {
						console.log("获取地址",e)
						that.upJson.longitude = e.longitude;
						that.upJson.latitude = e.latitude;
						var reg = /.+?(省|市|自治区|自治州|县|区)/g;
						
						if(e.address){
							that.address = e.address;
							that.upJson.province = e.address.match(reg)[0];
							that.upJson.city = e.address.match(reg)[1];
							that.upJson.area = e.address.match(reg)[2];
							that.upJson.address = e.address.split('区')[1];
						}
					},
					fail(err) {
						console.log(err)
					}
				})
			},
			getInputValue(e){//获取数据
				if(e.currentTarget.dataset.name == "type"){
					this.upJson.type = this.typeList[e.detail.value];
				}else{
					this.upJson[e.currentTarget.dataset.name] = e.detail.value;
				}
			},
			save(){//保存提交
			// console.log(this.upJson)
			// return
				if(this.upJson.title.length < 1){
					uni.showToast({title:"商户名称不能为空",icon:"none"})
				}else if(this.upJson.country.length < 1){
					uni.showToast({title:"区域不能为空",icon:"none"})
				}else if(this.upJson.name.length < 1){
					uni.showToast({title:"联系人不能为空",icon:"none"})
				}else if(this.upJson.mobile.length != 11){
					uni.showToast({title:"联系电话格式错误",icon:"none"})
				}else if(this.address.length < 1){
					uni.showToast({title:"地址不能为空",icon:"none"})
				}else{
					this.$app.globalData.upData.client = true;
					this.$app.globalData.upData.clientInfo[0] = true;
					let data=deepClone(this.upJson);
					data.labels=data.labels.replace(/\|/g,',');
					this.$api.addClient(data,this.type)
				}
			}
		},
		watch:{
			afterSale:{
				deep:true,
				handler(val){
					this.upJson.sale_user_id=val.id;
				}
			},
			businessContact:{
				deep:true,
				handler(val){
					this.upJson.contact_user_id=val.id;
				}
			},
		}
	}
</script>

<style>
	.add{width: 100%;background: #FFFFFF;padding-bottom: 50upx;}
</style>
